<%content_for :head do%>
<script type="text/javascript">
	
jQuery(document).ready(function(){
	var expand_img = '/images/b_expand.gif';
	var collapse_img = '/images/b_collapse.gif';
	var triggers = jQuery('tr.trigger');
	
	jQuery('td:first', triggers).prepend('<img src="' + collapse_img + '"/>&nbsp;');
	
	jQuery('img', triggers).click(function() {
		var src = jQuery(this).attr('src');
		var id = jQuery(this).parent().parent('.trigger').attr('id');
		var collapsable = jQuery('tr.collapsable[trigger=' + id + ']');
		if ( src == expand_img ) {
			jQuery(this).attr('src', collapse_img);
			collapsable.fadeIn('fast');
		} else {
			jQuery(this).attr('src', expand_img);
			collapsable.fadeOut('fast');
		}
	});
});

</script>
<% end %>

<span class="title_three"><%= title %></span>

<table cellspacing="0" cellpadding="0" class="summary_one">
    <col id="col1"/><col id="col2"/>
    <tbody>
    	<tr><b></b>
        	<th class="col1"><%= _('Overall complete')%></th>
        	<th class="col2"><%= percentage overall[:total] %></th>
        </tr>
        <tr>
        	<td class="col1"><%= _('Overall Cross Border Site Complete')%></td>
			<td class="col2"><%= percentage overall[:xb_site] %></td>
		</tr>
        <tr>
        	<td class="col1"><%= _('Overall Country Strategy Coordinator Complete')%></td>
			<td class="col2"><%= percentage overall[:cc] %></td>
		</tr>
        <tr>
        	<td class="col1"><%= _('Overall Lead Strategy Coordinator Complete')%></td>
			<td class="col2"><%= percentage overall[:strategy] %></td>
		</tr>
    </tbody>
</table>

<br/><br/>

<table cellspacing="0" cellpadding="0" class="summary_two">
	<col id="col1"/>
	<tbody>
		<tr>
            <th class="col1"><%= _('Details')%></th>
            <th class="col2"><%= _('Cross Border')%></th>
			<th class="col2"><%= _('Country Coordinator')%></th>
			<th class="col2"><%= _('Strategy Coordinator')%></th>
		</tr>
		
		<tr class="trigger" id="strategies">
			<td class="col1"><%= _('Strategies')%></td>
			<td class="col4"><%= percentage overall[:strategy_xb] %></td>
			<td class="col4"><%= percentage overall[:strategy_cc] %></td>
			<td class="col4"><%= percentage overall[:strategy] %></td>
		</tr>
		
		<% strategy_responses.each do |r| %>
			<% strategy = r.owner_role.strategy %>
			<tr class="collapsable" trigger="strategies">
        		<td class="col3">
					<%= strategy.grouping.tab_name %>
				</td>
				<td class="col2"><%= percentage strategy_xb_responses[strategy] %></td>
				<td class="col2"><%= percentage strategy_cc_responses[strategy] %></td>
				<td class="col2"><%= percentage r.completed %></td>
			</tr>
		<% end %>
		
		<% countries.each do |country| %>
			<%
				xb_responses = xb_responses_by_country[country]
				strategies = strategy_responses_by_country[country]
				cc_responses = cc_responses_by_country[country]
				
				# Skip if there is nothing to show
				next if xb_responses.nil? and strategies.nil? and cc_responses.nil?
			%>
			
			<tr class="trigger" id="<%= country.id %>">
                <td class="col1"><%= _(country.name) %></td>
				<td class="col4" colspan="3"><%= percentage overall_by_country[country] %></td>
			</tr>
			
			<% unless strategies.nil? %>
				<% strategies.each do |r| %>
					<% role = r.owner_role %>
					<tr class="collapsable" trigger="<%= country.id %>">
						<td class="col3">
							<%= role.strategy.grouping.tab_name %>
						</td>
						<td class="col2" colspan="3"><%= percentage r.completed %></td>
					</tr>
				<% end %>
			<% end %>
			
			<% unless cc_responses.nil? %>
				<% cc_responses.each do |r| %>
					<tr class="collapsable" trigger="<%= country.id %>">
						<td class="col3"><%= _('CC Report')%></td>
						<td class="col2" colspan="3"><%= percentage r.completed %></td>
					</tr>
				<% end %>
			<% end %>
			
			<% unless xb_responses.nil? %>
				<% xb_responses.each do |r| %>
					<% role = r.owner_role %>
					<tr class="collapsable" trigger="<%= country.id %>">
						<td class="col3">
							<%=role.coordinated.cross_borders.map {|xb| "XB#{xb.number} - #{xb.code}"}.join("<br/>")%>
						</td>
						<td class="col2" colspan="3"><%= percentage r.completed %></td>
					</tr>
				<% end %>
			<% end %>
		<% end %>
    </tbody>
</table>
